import React, { Component } from 'react'
import store from '../../store'

export default class Classify extends Component {
    state = {
        list: [
            {
                title: "圣女果",
                id: 100
            },
            {
                title: "紫洋葱",
                id: 101
            },
            {
                title: "圆白菜",
                id: 102
            }
        ]
    }
    pushDetail = (id) => {
        // 传参三种方式
        // 1. 永久存储--url不可见
        // this.props.history.push({
        //     // 路由地址
        //     pathname: "/detail",
        //     state: {
        //         id
        //     }
        // })
        // 2. 临时存储--刷新丢失--url不可见
        // this.props.history.push({
        //     // 路由地址
        //     pathname: "/detail",
        //     aaaaa: {
        //         id
        //     }
        // })
        // 3. url可见
        this.props.history.push("/detail/" + id)
    }
    render() {
        const { list } = this.state
        return (
            <div>
                {
                    list.map(item => {
                        return <div className="oDiv"
                            onClick={() => {
                                this.pushDetail(item.id)
                            }}
                            key={item.id}>
                            {item.title}
                        </div>
                    })
                }

                <h2>
                    { store.getState().count }
                </h2>
            </div>
        )
    }
}
